<template>
	<view class="pageview flex flex-direction">
		<zx-nav title="组团邀请"  bg="transparent" color="#000" ></zx-nav>
		<view class="top-wrap"></view>
		<view class="pageCon">
			<image src="/static/group/message.png" class="img" mode="widthFix"></image>
			<view class="info">{{groupInfo.createDocterName}}邀请你加入他的团队</view>
			<view class="remark">同意后，你将可以共享团队患者信息</view>
			<view class="footerBar">
				<u-button type="primary" :loading="isLoading"  text="同意加入" shape="circle"  @click="confirmJoin"></u-button>
				<u-button type="primary" plain text="返回首页" shape="circle" @click="backHome"></u-button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				groupInfo:{
					createDocterName:''
				},
				isLoading:false
			};
		},
		// 在加入页面（pages/join/index.vue）的onLoad中
		onLoad(query) {
			console.log("参数"+JSON.stringify(query.groupInfo))
		  if (query.groupInfo) {
		    this.groupInfo =query.groupInfo;
		  }
		  console.log("this.isLogin",this.isLogin)
		  //判断是否登录账号
		  if(!this.isLogin){
			 this.$Router.replaceAll({
			 	path: '/pages/login/login'
			 });
		  }
		},
		computed: {
			...mapState(['isLogin'])
		},
		methods: {
			...mapActions(['getUserInfo']),
			// 确认加入
			confirmJoin() {
			  uni.showLoading({ title: '处理中...' });
			  let params={
				  "createDocterId":  this.groupInfo.createDocterId,
				  "deptId": this.groupInfo.deptId,
				  "groupid": this.groupInfo.groupid
				}
				this.$postAction(this.$groupapi.addGroup,params).then(da => {
					uni.hideLoading();
					uni.showToast({ title: '加入成功' });
					if (getCurrentPages().length <= 1) {
						this.$Router.replaceAll({
							name: 'index'
						});
					} else {
						uni.navigateBack({
							delta: 1
						});
					}
				});
			},
			backHome(){
				this.$Router.replaceAll({
					name: 'index'
				});
			}
		},
	}
</script>

<style scoped lang="scss">
	.pageview {
		height: 100vh;
		background: #f7f7fc;
	
		&>view {
			position: relative;
		}
	
		.top-wrap {
			background: linear-gradient(180deg, #e1faf7 0%, #f7f7fc 79%);
			position: absolute;
			left: 0;
			width: 100%;
			height: 750upx;
			top: 0;
		}
	}
	.pageCon{
		text-align: center;
		margin-top: 40upx;
		.img{
			width:350upx;
			height: 350upx;
			margin-bottom: 40upx;
		}
		.info{
			color: #1C2023;
			font-size: 32upx;
		}
		.remark{
			color: #606972;
			font-size: 24upx;
			margin-top: 20upx;
		}
		/deep/.footerBar{
			margin: 69upx 24upx 0 ;
			.u-button+.u-button{
				margin-top: 30upx;
			}
		}
	}
</style>
